import { postAction, spliceUrl } from '../common/js/api/vue3-axios-utils.js'
export const sku = {
	name: 'sku',
	data() {
		return {
			active: 0,
			detail: {},
			num: 1,
			toCar: false,
			type: '',
			show: false,
		}
	},
	created() {
		this.type = url('?type')
	},
	methods: {
		view(record, toCar) {
			this.show = true
			this.toCar = toCar ? true : false
			this.detail = record
			console.log(this.detail)
		},
		handleClose() {
			this.active = 0
			this.toCar = false
			this.show = false
		},
		minus() {
			this.num--
		},
		add() {
			this.num++
		},
		confirmToCar() {
			const params = {
				patient_id: this.detail.patient_id,
				product_id: this.detail.data_id,
				num: this.num,
			}
			postAction(spliceUrl('/shop/cart/add'), params).then(res => {
				if (res.data.success) {
					this.$toast.success({
						message: '加入成功',
						duration: 500,
						onClose: () => {
							this.show = false
						},
					})
				} else {
					this.$toast.fail({
						message: res.data.message,
					})
				}
			})
		},
		confirm() {
			const products = [
				{
					id: this.detail.data_id,
					num: this.num,
				},
			]
			sessionStorage.setItem('products', JSON.stringify(products))
			window.location.href = './confirm.html?pid=' + this.detail.patient_id
		},
	},
	template: `
	<van-popup v-model:show="show" position="bottom" closeable round :style="{ height: '7.75rem',padding:'0.33rem',width:'calc(100% - 0.66rem)' }" @close="handleClose">
		<div>
			<img :src="detail.product_thumb" style="display:inline-block;width:1.51rem;height:1.51rem;margin-right:0.25rem"/ >
			<div style="display:inline-block">
				<p style="font-size:0.25rem;color:#3E3E3E;margin-bottom:0.125rem">{{detail.product_name}}</p>
				<span style="margin-right:0.17rem;color:#01CD9C;font-size:0.33rem">￥{{detail.product_price}}</span>
				
			</div>
			<div class="stepper">
				<div style="font-size:0.33rem;color:#333333">购买数量</div>
				<div style="display:flex;align-items: center;">
					<van-button @click="minus" :disabled="num == 1">-</van-button>
					<span class="stepper_num">{{num}}</span>
					<van-button @click="add">+</van-button>
				</div>
			</div>
			<van-button v-if="toCar" class="btn" @click="confirmToCar">确定</van-button>
			<van-button v-else class="btn" @click="confirm">立即购买</van-button>
		</div>
	<van-popup>
	`,
}
